/* 
我们需要在特定的时候判断页面的显示状态，例如：当视频加载到可播放状态时，根据用户是否停留在当前页面来决定是否开始自动播放。页面的展示的状态的判断就需要用到html5新增的一个api：document.hidden。

　　document.hidden属性：bool型，表示页面是否处于隐藏状态。页面隐藏包括页面在后台标签页或者浏览器最小化。

　　visibilitychange事件：当文档的可见性改变时触发。

 　　兼容性写法如下，当在浏览器里切换标签页或者最小化时就会console打印出状态的变化：
*/
var hidden, visibilityChange
if (typeof document.hidden !== 'undefined') {
	hidden = 'hidden'
	visibilityChange = 'visibilitychange'
} else if (typeof document.mozHidden !== 'undefined') {
	hidden = 'mozHidden'
	visibilityChange = 'mozvisibilitychange'
} else if (typeof document.msHidden !== 'undefined') {
	hidden = 'msHidden'
	visibilityChange = 'msvisibilitychange'
} else if (typeof document.webkitHidden !== 'undefined') {
	hidden = 'webkitHidden'
	visibilityChange = 'webkitvisibilitychange'
}

// 添加监听器
document.addEventListener(
	visibilityChange,
	function() {
		console.log('当前页面是否被隐藏：' + document[hidden])
	},
	false
)
